<template>
	<view class="app-container">
		<view class="agreement-content">
			<rich-text :nodes="agreementContent"></rich-text>
		</view>
		<view class="submit-box">
			<button type="primary" hover-class="is-hover" @click="handleAgree">我同意</button>
			<!-- 底部安全距离 -->
			<uv-safe-bottom></uv-safe-bottom>
		</view>
	</view>
</template>

<script setup>
	import {
		getAgreement
	} from "@/api";
	import {
		reactive,
		toRefs
	} from "vue";
	import { onLoad } from '@dcloudio/uni-app';

	const state = reactive({
		agreementContent: ""
	});

	const {
		agreementContent
	} = toRefs(state);

	// 获取协议
	async function getAgreementData(type) {
		const res = await getAgreement({ id: type });
		agreementContent.value = res.data.content;
	}
	
	// 同意协议
	function handleAgree() {
		uni.navigateBack({
			delta: 1
		})
	}
	
	onLoad((options) => {
		getAgreementData(options.type)
	})
</script>

<style scoped lang="scss">
	.app-container {
		background-color: #FFFFFF;

		.agreement-content {
			padding: 30rpx;
			flex: 1;
			overflow-y: auto;
		}
	}
</style>